<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>挂号列表</title>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"
    />
    <link rel="stylesheet" href="/public/static/css/font.css" />
    <link rel="stylesheet" href="/public/static/css/weadmin.css" />
    <style>
      span.record-status {
        display: block;
        padding: 1px 1px;
        /* font-size: 12px; */
        text-align: center;
      }
    </style>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body>
    <div class="weadmin-nav">
      <span class="layui-breadcrumb">
        <a><cite>挂号管理</cite></a>
        <a><cite>挂号列表</cite></a>
      </span>
      <a
        class="layui-btn layui-btn-sm"
        style="line-height: 1.6em; margin-top: 3px; float: right;"
        href="javascript:location.replace(location.href);"
        title="刷新"
      >
        <i class="layui-icon" style="line-height: 30px;">ဂ</i></a
      >
    </div>
    <div class="weadmin-body">
      <div class="layui-row">
        <form class="layui-form layui-col-md12 we-search">
          <div class="layui-inline">
            <input
              type="text"
              name="keywords_patient_name"
              placeholder="请输入患者名称"
              autocomplete="off"
              class="layui-input"
            />
          </div>
          <div class="layui-inline">
            <select name="keywords_status" lay-verify="">
              <option value="">请选择挂号状态</option>
              <% categoryList.forEach((item,index)=>{ %>
              <option value="<%- item.id %>"><%- item.value %></option>
              <% }) %>
            </select>
          </div>
          <button class="layui-btn" lay-submit="" lay-filter="search">
            <i class="layui-icon">&#xe615;</i>
          </button>
        </form>
      </div>
      <div class="weadmin-block">
        <!-- <button
          class="layui-btn"
          onclick="WeAdminShow('添加新闻','/admin/news/add')"
        >
          <i class="layui-icon"></i>添加
        </button> -->
        <!-- <span class="fr" style="line-height:40px">共有数据：88 条</span> -->
      </div>
      <table class="layui-table" id="demo" lay-filter="test"></table>
      <div class="page">
        <!-- <div>
				<a class="prev" href="">&lt;&lt;</a>
				<a class="num" href="">1</a>
				<span class="current">2</span>
				<a class="num" href="">3</a>
				<a class="num" href="">489</a>
				<a class="next" href="">&gt;&gt;</a>
			</div> -->
      </div>
    </div>
    <script src="/public/lib/layui/layui.js" charset="utf-8"></script>
    <!-- <script src="/public/static/js/eleDel.js" type="text/javascript" charset="utf-8"></script> -->
    <script>
      layui.extend({
        admin: '{/}/public/static/js/admin',
      })
      layui.use(['jquery', 'admin', 'table', 'laydate', 'form'], function () {
        var table = layui.table,
          $ = layui.jquery,
          admin = layui.admin,
          laydate = layui.laydate,
          form = layui.form

        // 选择的日期
        laydate.render({
          elem: '#start-date', //指定元素
        })
        laydate.render({
          elem: '#end-date', //指定元素
        })

        //第一个实例
        const tableIns = table.render({
          elem: '#demo',
          // , height: 100
          url: '/admin/records/data', //数据接口
          parseData: function (res) {
            //res 即为原始返回的数据
            return {
              code: res.code, //解析接口状态
              msg: res.msg, //解析提示文本
              count: res.data.count, //解析数据长度
              data: res.data.arr, //解析数据列表
            }
          },
          page: true, //开启分页
          limit: 5, //每页大小
          limits: [5], //每页大小选择
          // , size: 'sm'
          cols: [
            [
              //表头
              { field: 'id', title: 'ID', fixed: 'left', width: 60 },
              { field: 'patient_name', title: '患者名称' },
              { field: 'clinic_name', title: '科室名称' },
              {
                field: 'registration_time_text',
                title: '挂号时间',
                width: 160,
                sort: true,
              },
              {
                field: 'visit_time_text',
                title: '看病时间',
                width: 160,
                sort: true,
              },
              { field: 'doctor_name', title: '医生名称' },
              {
                title: '挂号状态',
                templet: '#record_status_template',
              },
              { title: '操作', templet: '#operateBtn' },
            ],
          ],
        })

        // 搜索内容
        form.on('submit(search)', function (data) {
          tableIns.reload({
            where: {
              //设定异步数据接口的额外参数，任意设
              start_date: data.field.start_date,
              end_date: data.field.end_date,
              keywords_patient_name: data.field.keywords_patient_name,
              keywords_status: data.field.keywords_status,
              //…
            },
            page: {
              curr: 1, //重新从第 1 页开始
            },
          })

          return false
        })

        /*用户-删除*/
        window.member_del = function (obj, id) {
          layer.confirm('确认要删除吗？', function (index) {
            //发异步删除数据
            $.ajax({
              url: '/admin/news/delete',
              data: { id },
              type: 'POST',
              success: function (res) {
                console.log(res)
                $(obj).parents('tr').remove()
                layer.msg('已删除!', {
                  icon: 1,
                  time: 1000,
                })
              },
            })
          })
        }
      })
    </script>
    <script type="text/html" id="record_status_template">

      <span
      {{# if (d.record_status === 1) { }}
      class="layui-bg-green record-status"
      {{# } else if(d.record_status === 2) { }}
      class="record-status"
      {{# } else { }}
      class="layui-bg-blue record-status"
      {{# } }}
      >
      {{ d.record_status_text }}</span>
    </script>
    <script type="text/html" id="operateBtn">
      <a title="编辑" onclick="WeAdminShow('编辑','/admin/records/edit/{{d.id}}')" href="javascript:;">
      	<i class="layui-icon">&#xe642;</i>
      </a>
      <!-- <a title="删除" onclick="member_del(this,'{{d.id}}')" href="javascript:;">
      	<i class="layui-icon">&#xe640;</i>
      </a> -->
    </script>
  </body>
</html>
